@import"./com";

header{
    // 最顶部
    .h_top{
        width: vw(750);
        display: flex;
        justify-content: space-around;
        justify-items: center;
        margin-top: vw(48);
        text-align: center;
        line-height: vw(50);
        >.h_top1{
            width: vw(710);
            display: flex;
            justify-content: space-between;
            >a:first-of-type{
                >div{
                    width: vw(122);
                    height: vw(50);
                    border: vw(1) solid #ff9344;
                    border-radius: vw(10);
                    
                    font-size: vw(21);
                }
            }
            >span{
                font-size: vw(25);
            }
            > a:last-of-type{
                > img{
                    width: vw(35);
                    height: vw(35);
                }
            }
        }
    }
}

main{

    // 顶部推荐产品详情（大图）
    >.m_top{
        width: vw(750);
    //    display: flex;
    //    flex-direction: column;
    //    justify-content: center;
    //    justify-items: center;

        // 图片
        >.m_top1{
            width: vw(750);
            margin-top: vw(26);
            text-align: center;
        >a{
            >img{
                width: vw(700);
                height: vw(260);
            }
        }
        }
        // 价格
        >.m_top2{
            width: vw(750);
            display: flex;
            justify-content: center;
            >.m_top21{
                width: vw(665);
                margin-top: vw(36);
                display: flex;
                justify-content: space-between;
                
                >span{
                    font-size: vw(56);
                    color: #ff9344;
                }
                >a{
                    >p{
                        width: vw(110);
                        height: vw(59);
                        background-color: #ff9344;
                        border-radius: vw(20);
                        font-size: vw(28);
                        text-align: center;
                        line-height: vw(59);
                    }
                }
            }
        }
        // 好评度
        >.m_top3{
            width: vw(750);
            margin-top: vw(58);
                display: flex;
                justify-content: center;
                justify-items: center;
            >.m_top31{
                width: vw(665);
                display: flex;
                justify-content: space-between;
                justify-items: center;
                
                >div:first-of-type{
                    display: flex;
                    justify-content: space-between;
                    width: vw(200);
                    >img{
                        width: vw(35);
                        height: vw(35);
                    }
                    >p{
                        display: inline;
                        font-size: vw(28);
                    }
                }

                >div:last-of-type{

                    >a{
                        font-size: vw(25);
                        color: #8e8e8e;
                    }
                }
            }

            
        }
    }

    // 适用商户
    >.m_sy{
        width: vw(750);
        display: flex;
        justify-content: center;
        margin-top: vw(36);
        >a{
            width: vw(665);
            display: inline-block;
            background-color: #ff9433;
            display: flex;
            justify-content: space-between;
            justify-items: center;
            >p{
                color: white;
                font-size: vw(29);
            }
        }
    }


    // 店铺信息1
    >.m_imt1{
        margin-top: vw(10);
        width: vw(750);
        display: flex;
       justify-content: center;
        justify-items: center;
        .m_imt1_1{
            width: vw(665);
            display: flex;
            justify-content: space-between;
            justify-items: center;
            >div:first-of-type{
                >a{
                    img{
                        width: vw(176);
                        height: vw(176);
                    }
                }
            }

            >.m_imt1_2{
                width: vw(465);
                display: flex;
                justify-content: space-between;
                
                justify-items: center;

                >div:first-of-type{
                    width: vw(265);
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    >span:first-of-type{
                        font-size: vw(27);
                    }
                    >.start{
                        width: vw(261);
                        display: flex;
                        justify-content: space-between;
                        justify-items: center;
                        >img{
                            width: vw(34);
                            height: vw(34);
                        }
                        >p{
                            font-size: vw(26);
                            color: #929292;
                        }
                    }
                    >span:last-of-type{
                        font-size: vw(24);
                        color: #929292;
                    }
                    >a{
                        font-size: vw(19);
                        color: #ff9433;
                    }
                   
                }
                 // 进入按钮
                 >div:last-of-type{
                    line-height: vw(176);
                    >a{
                        display: inline-block;
                        width: vw(111);
                        height: vw(59);
                        background-color: #ff9433;
                        font-size: vw(29);
                        color: white;
                        text-align: center;
                        line-height: vw(59);
                        border-radius: vw(20);
                    }
                }
            }
        }
    }

     // 店铺信息2
     >.m_imt2{
        margin-top: vw(10);
        width: vw(750);
        display: flex;
       justify-content: center;
        justify-items: center;
        .m_imt2_1{
            width: vw(665);
            display: flex;
            justify-content: space-between;
            justify-items: center;
            >div:first-of-type{
                >a{
                    img{
                        width: vw(176);
                        height: vw(176);
                    }
                }
            }

            >.m_imt2_2{
                width: vw(465);
                display: flex;
                justify-content: space-between;
                
                justify-items: center;

                >div:first-of-type{
                    width: vw(285);
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    >span:first-of-type{
                        font-size: vw(27);
                    }
                    >.start{
                        width: vw(261);
                        display: flex;
                        justify-content: space-between;
                        justify-items: center;
                        >img{
                            width: vw(34);
                            height: vw(34);
                        }
                        >p{
                            font-size: vw(26);
                            color: #929292;
                        }
                    }
                    >span:last-of-type{
                        font-size: vw(24);
                        color: #929292;
                    }
                    >a{
                        font-size: vw(19);
                        color: #ff9433;
                    }
                   
                }
                 // 进入按钮
                 >div:last-of-type{
                    line-height: vw(176);
                    >a{
                        display: inline-block;
                        width: vw(111);
                        height: vw(59);
                        background-color: #ff9433;
                        font-size: vw(29);
                        color: white;
                        text-align: center;
                        line-height: vw(59);
                        border-radius: vw(20);
                    }
                }
            }
        }
    }

    // 店铺信息3
    >.m_imt3{
        margin-top: vw(10);
        width: vw(750);
        display: flex;
       justify-content: center;
        justify-items: center;
        .m_imt3_1{
            width: vw(665);
            display: flex;
            justify-content: space-between;
            justify-items: center;
            >div:first-of-type{
                >a{
                    img{
                        width: vw(176);
                        height: vw(176);
                    }
                }
            }

            >.m_imt3_2{
                width: vw(465);
                display: flex;
                justify-content: space-between;
                
                justify-items: center;

                >div:first-of-type{
                    width: vw(285);
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    >span:first-of-type{
                        font-size: vw(27);
                    }
                    >.start{
                        width: vw(261);
                        display: flex;
                        justify-content: space-between;
                        justify-items: center;
                        >img{
                            width: vw(34);
                            height: vw(34);
                        }
                        >p{
                            font-size: vw(26);
                            color: #929292;
                        }
                    }
                    >span:last-of-type{
                        font-size: vw(24);
                        color: #929292;
                    }
                    >a{
                        font-size: vw(19);
                        color: #ff9433;
                    }
                   
                }
                 // 进入按钮
                 >div:last-of-type{
                    line-height: vw(176);
                    >a{
                        display: inline-block;
                        width: vw(111);
                        height: vw(59);
                        background-color: #ff9433;
                        font-size: vw(29);
                        color: white;
                        text-align: center;
                        line-height: vw(59);
                        border-radius: vw(20);
                    }
                }
            }
        }
    }
}

nav{
    position: fixed;
    bottom: 0;
    background-color: #fff;
    .f_nav{
       

        width: vw(750);
        display: flex;
        justify-content: space-around;
        > div{
            display: flex;
            flex-direction: column;
            justify-content: space-around;

            > a{
                font-size: vw(24);
                text-align: center;
                img{
                    width: vw(73);
                    height: vw(73);
                }
            }
        }
    }

    
}